<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>穷在闹市出品</title>

    <!-- 公共样式 开始 -->
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/manager/css/base.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/manager/css/iconfont.css">
    <script type="text/javascript" src="${pageContext.request.contextPath}/manager/framework/jquery-1.11.3.min.js"></script>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/manager/layui/css/layui.css">
    <script type="text/javascript" src="${pageContext.request.contextPath}/manager/layui/layui.js"></script>
    <!-- 滚动条插件 -->
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/manager/css/jquery.mCustomScrollbar.css">
    <script src="${pageContext.request.contextPath}/manager/framework/jquery-ui-1.10.4.min.js"></script>
    <script src="${pageContext.request.contextPath}/manager/framework/jquery.mousewheel.min.js"></script>
    <script src="${pageContext.request.contextPath}/manager/framework/jquery.mCustomScrollbar.min.js"></script>
    <script src="${pageContext.request.contextPath}/manager/framework/cframe.js"></script><!-- 仅供所有子页面使用 -->


    <!-- 公共样式 结束 -->

    <style>
        .layui-table img {
            max-width: none;
        }
    </style>

</head>

<body>
    <script type="text/html" id="toolbarDemo">
        <button type="button" class="layui-btn layui-btn-normal" >添加</button>
    </script>

<div class="cBody">
    <div class="console">

        <script>
            layui.use('form', function() {
                var form = layui.form;

                //监听提交
                form.on('submit(formDemo)', function(data) {
                    layer.msg(JSON.stringify(data.field));
                    return false;
                });
            });
        </script>
    </div>
    <table class="layui-hide" id="test" lay-filter="test">

    </table>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>
    <script>

        layui.use('table', function() {
            var table = layui.table;
            $.ajax({
                url:'${pageContext.request.contextPath}/flowerServlet?action=list',
                type:"post",
                dataType:"json",
                success:function (data) {
                    // alert(data)
                    table.render({
                        elem: '#test'
                        ,toolbar: '#toolbarDemo'
                        ,data:data
                        ,title: '用户数据表'
                        ,cols:
                            [[ //表头
                                {field: 'id',type: 'checkbox', title: 'ID', width:80, sort: true, fixed: 'left'}
                                ,{field: 'name', title: '名称', width:150}
                                ,{field: 'sort_id', title: '分类', width:80, sort: true}
                                ,{field: 'img_path',type: 'img' ,title: '图片', width:150}
                                ,{field: 'material', title: '材料', width: 150}
                                ,{field: 'pack', title: '包装', width: 248, sort: true}
                                ,{field: 'price', title: '价格', width: 80, sort: true}
                                ,{field: 'slogan', title: '花语', width: 250}
                                ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:65}
                            ]]
                        ,page: true //是否显示分页
                        ,limits: [10, 20, 30]
                        ,limit: 10 //每页默认显示的数量

                    });

                }

            })
            //监听行工具事件
            table.on('tool(test)', function(obj){
                var data = obj.data;

                //console.log(obj)
                if(obj.event === 'del'){
                    console.log(data)
                    layer.confirm('确定删除这条数据？', function(index){
                        obj.del();
                        layer.close(index);
                        window.location.href="${pageContext.request.contextPath}/flowerServlet?action=deleteFlower&id="+data.id;
                    });
                }

            });

        })



    </script>

    <!-- layUI 分页模块 -->
    <div id="pages"></div>


    <script>

        //修改规格
        function specificationsBut(){
            layui.use('layer', function() {
                var layer = layui.layer;

                //iframe层-父子操作
                layer.open({
                    type: 2,
                    area: ['70%', '60%'],
                    fixed: false, //不固定
                    maxmin: true,
                    content: 'specifications_list.html'
                });
            });

        }
        //修改按钮
        var updateFrame = null;
        function updateBut(){
            layui.use('layer', function() {
                var layer = layui.layer;

                //iframe层-父子操作
                updateFrame = layer.open({
                    title: "商品信息修改",
                    type: 2,
                    area: ['70%', '60%'],
                    scrollbar: false,	//默认：true,默认允许浏览器滚动，如果设定scrollbar: false，则屏蔽
                    maxmin: true,
                    content: 'goods_update.html'
                });
            });



        }



    </script>
</div>
</body>

</html>
